<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/taglib_include.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, target-densitydpi=medium-dpi, initial-scale=0.5, minimum-scale=0.5, maximum-scale=0.5, user-scalable=no" />
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta content="telephone=no" name="format-detection" />
<link href="${ctx}/css/main.css?ver=${main_css_version}" rel="stylesheet" type="text/css" />
<title>${projectTitle }</title>
</head>
<body>
  <header id="main-top">
    <a href="${ctx}/trafficlinenc/index.do?startCityId=${ticketQueryParam.startCityId}&starting=${ticketQueryParam.starting}&startStationId=${ticketQueryParam.startStationId}&arriveCityId=${ticketQueryParam.arriveCityId}&destination=${ticketQueryParam.destination }&arriveStationId=${ticketQueryParam.arriveStationId }&leaveDate=${ticketQueryParam.leaveDate}">
      <div id="main-top-left">
        <img src="${ctx}/images/mui_title_back_btn.png" class="img-2">
      </div>
    </a>
    <input id="asn_txt" class="select-city" type="search" name="arriveStationName" placeholder="输入到达站名称搜索"/><img id="close_icon" class="close-xz" src="${ctx}/images/close.png" style="display:none;">
  </header>
  <div id="container">
  <c:forEach var="arriveStation" items="${arriveStations }">
    <div id="city-${arriveStation.cityId }" class="city-list">
      <h4>${arriveStation.cityInitial }</h4>
      <ul>
        <c:if test="${not empty arriveStation.cityName }">
        <li data-url="${ctx}/trafficlinenc/index.do?startCityId=${ticketQueryParam.startCityId}&starting=${ticketQueryParam.starting}&startStationId=${ticketQueryParam.startStationId}&arriveCityId=${arriveStation.cityId }&destination=${arriveStation.cityName }&arriveStationId=&leaveDate=${ticketQueryParam.leaveDate}">${arriveStation.cityName}（所有客运站）</li>
        </c:if>
        <c:forEach var="station" items="${arriveStation.stations }">
        <li data-url="${ctx}/trafficlinenc/index.do?startCityId=${ticketQueryParam.startCityId}&starting=${ticketQueryParam.starting}&startStationId=${ticketQueryParam.startStationId}&arriveCityId=&destination=${station.stationName }&arriveStationId=${station.stationId }&leaveDate=${ticketQueryParam.leaveDate}">${station.stationName }</li>
        </c:forEach>
      </ul>
    </div>
  </c:forEach>
  </div>
  <script type="text/javascript" src="${ctx}/js/jquery.min.js?ver=${jquery_min_version}"></script>
  <script type="text/javascript">
  // 检查浏览器是否是IE
  function isIE() {
	  if (navigator.userAgent.indexOf("MSIE") != -1){
          return true;
      } else {
    	  return false;
      }
  }
  $(document).ready(function() {
      // 点中选项后返回到车票查询页面
      $("#container").on("click", "li", function(e) {
          var url = $(this).attr("data-url");
          window.location.href = url;
      });
      // 到达站搜索框删除图标事件绑定
      $("#close_icon").bind("click", function(e){
    	  $("#asn_txt").val("");//清除文本内容
    	  if (isIE()) {
    		  $("#asn_txt").trigger("propertychange");
    	  } else {
    		  $("#asn_txt").trigger("input");
    	  }
    	  $(this).hide();
      });

      var bind_name = 'input';
      if (isIE()){
          bind_name = 'propertychange';
      }
      // 搜索到达站
      $("#asn_txt").bind(bind_name, function(e) {
    	  if ($(this).val() == "") {
    		  $("#close_icon").hide();
    	  } else {
    		  $("#close_icon").show();
    	  }

    	  var arriveListUrl = "${ctx}/stationnc/ajaxArrivelist.do?startCityId=${ticketQueryParam.startCityId}&starting=${ticketQueryParam.starting}&startStationId=${ticketQueryParam.startStationId}&arriveCityId=${ticketQueryParam.arriveCityId}&destination=${ticketQueryParam.destination }&arriveStationId=${ticketQueryParam.arriveStationId }&leaveDate=${ticketQueryParam.leaveDate}&arriveStationName=";
    	  arriveListUrl = arriveListUrl + $(this).val();
    	  $("#container").load(arriveListUrl); // 搜索出发站并将结果插入页面
      });
  });
  </script>
</body>
</html>
